<ion-header>
  <ion-navbar color="orange">
    <ion-title>提交保证金</ion-title>
  </ion-navbar>
</ion-header>


<ion-content padding>
  <div class="curr-bond">
    <div class="ht-text-center">当前保证金</div>
    <div class="bond-money flex flex-line-center">
      <span class="ht-font-18">￥</span>
      <span>{{frozen_money}}</span>
    </div>
  </div>
  <div class="bonus-recharge">
    <div class="mt-box">
      <div class="wallet-surplus">
        我的钱包余额：<span>{{surplus}}元</span>
      </div>
      <div class="ht-100">
        <div class="ht-100 ht-line-50 ht-font-14 ht-333">提交保证金</div>
        <div class="ht-100 ht-overflow">
          <div class="flex">
            <span class="ht-font-30 ht-blod ht-000">￥</span>
            <input type="number" class="mt-input" placeholder="0.00" [(ngModel)]="rechargeData.frozen_money" (keyup)="checkMoney()">
          </div>
          <div class="text-red" *ngIf="showNotice">钱包余额不足</div>
        </div>
      </div>
      <button class="mt-btn" margin-top (click)="doRecharge()" [disabled]="showNotice">提交</button>
    </div>
    <div class="mt-explain">
      <dl>
        <dt>保证金提交说明</dt>
        <dd>1、以自愿为原则；</dd>
        <dd>2、随时退还：保证金在非锁定状态可随时退还到“我的钱包”；</dd>
        <dd>3、任务锁定：接到有保证金要求的悬赏任务，保证金即时锁定，不得它用；</dd>
        <dd>4、保证金目的：提高信用度（例如：顶岗保证金）；违约与损害保证。</dd>
      </dl>
    </div>
  </div>
</ion-content>
